<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>图像拼合-导航列表</title>
    <style>
        #navlist {
            position: relative;
        }

        #navlist li {
            margin: 0;
            padding: 0;
            list-style: none;
            position: absolute;
            top: 0;
        }

        #navlist li,
        #navlist a {
            height: 44px;
            display: block;
        }

        #home {
            left: 0px;
            width: 46px;
        }

        #home {
            background: url('https://www.runoob.com/images/img_navsprites.gif') 0 0;
        }

        #prev {
            left: 63px;
            width: 43px;
        }

        #prev {
            background: url('https://www.runoob.com/images/img_navsprites.gif') -47px 0;
        }

        #next {
            left: 129px;
            width: 43px;
        }

        #next {
            background: url('https://www.runoob.com/images/img_navsprites.gif') -91px 0;
        }
    </style>
</head>

<body>
    <ul id="navlist">
        <li id="home"><a href="/"></a></li>
        <li id="prev"><a href="/css/"></a></li>
        <li id="next"><a href="/css/"></a></li>
    </ul>
</body>

</html>